// 顶部按钮
.topBtn {
    position: fixed;
    display: flex;
    justify-content: space-between;
    align-items: center;
    top: 10px;
    left: 10px;
    right: 10px;
    white-space: nowrap;
    .topBtnLeft {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        .selectAddr {
            cursor: pointer;
            margin-left: 12px;
            margin-right: 10px;
            display: flex;
            justify-content: flex-start;
            align-items: center;
            background: #3f4854;
            border-radius: 5px;
            color: #ffffff;
            width: 40px;
            padding-left: 11px;
            font-size: 18px;
            overflow: hidden;
            transition: all 0.5s;
            .input__icon {
                margin-right: 11px;
            }
        }
        .actttiveSelectAddr {
            width: auto;
        }
    }
    .btnsImages {
        margin-right: 5px;
    }

    .topBtnsRight {
        .btnList {
            margin-left: 12px;
        }
    }
}
// 功能弹窗主体
.functionalwindow {
    position: fixed;
    width: 302px;
    height: calc(100vh - 90px);
    min-height: 130px;
    top: 48px;
    right: 10px;
    z-index: 1000;
    background: rgba(30, 36, 50, 0.6);
    border: 1px solid rgba(32, 160, 255, 0.3);
    border-radius: 2px;
    .coverageTitle {
        width: 100%;
        height: 40px;
        line-height: 40px;
        border-bottom: 1px solid rgba(32, 160, 255, 0.3);
        display: flex;
        justify-content: space-between;
        padding: 0 15px 0 10px;
        align-items: center;
        cursor: move;
        .coverageTitleName {
            color: #ffffff;
            font-size: 12px;
            .btnsImages {
                width: 13px;
                height: 13px;
                vertical-align: middle;
            }
        }
        .closeIcon {
            cursor: pointer;
            color: #ffffff;
            font-size: 13px;
        }
    }
    .functionalwindowMainFootor {
        padding: 2px;
        height: calc(100% - 76px);
    }

    .functionalwindowMain {
        padding: 2px;
        height: calc(100% - 40px);
    }
    .functionalwindowFooter {
        padding: 2px;
    }
}
.functionalwindowleft {
    right: auto;
    left: 10px;
}
// 图层树
.coverage {
    .coverageHeader {
        width: 100%;
        height: 36px;
        border-bottom: 1px solid rgba(32, 160, 255, 0.3);
        color: #ffffff;
        display: flex;
        justify-content: flex-start;
        padding: 3px 10px;
        .toolBtn {
            margin-right: 10px;
            i {
                width: 28px;
                height: 28px;
                line-height: 25px;
                text-align: center;
                background-color: rgba(63, 72, 84, 0.6);
                border: #dedede 1px solid;
                cursor: pointer;
            }
        }

        .halfSeparate {
            width: 1px;
            height: 20px;
            margin-top: 5px;
            background: #ffffff;
            margin-right: 10px;
        }
    }
    .treeBox {
        // height: calc(100% - 76px);
        // padding: 2px;
        height: 100%;
    }
}
// 工具弹窗样式文字
.textBtns {
    display: flex;
    justify-content: space-between;
    align-items: center;
    button {
        padding: 5px 8px;
    }
}
.submitBtn {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 34px;
}
.isselectBtn {
    color: #ffffff !important;
}
.functionaltopBtns {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    // .el-button+.el-button{
    //     margin-left: 0;
    // }
    .el-button {
        width: 30%;
        text-align: center;
        margin: 5px 0;
        margin-left: 1%;
        &:nth-child(3n + 1) {
            margin-left: 0;
        }
    }
}
.punctuationList {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    .punctuationListItem {
        width: 65px;
        // height: 55px;
        margin: 5px 0;
        margin-left: 12px;
        position: relative;
        &:nth-child(4n + 1) {
            margin-left: 0;
        }
        &:hover {
            .punctuationListItemimg {
                border: 1px solid rgba(32, 160, 255, 0.5);
            }
            .itemNames {
                color: rgba(32, 160, 255, 0.5);
            }
        }
        .punctuationListItemcheckbox {
            position: absolute;
            left: 0;
            top: 0;
            height: 14px;
            border-radius: 5px;
        }
        // display: flex;
        // justify-content: center;
        // align-items: center;
        .punctuationListItemimg {
            height: 65px;
            width: 65px;
            border: 1px solid #ffffff;
            border-radius: 3px;
            cursor: pointer;
        }
        .itemNames {
            text-align: center;
            white-space: nowrap;
            width: 65px;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    }
}
.nodeData {
    color: #999999;
    text-align: center;
}
/*
*   属性编辑样式
*/
.editorformTable {
    width: 100%;
    border: 1px solid #ffffff;
    .editorformItem {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        border: 1px solid #ffffff;
        .editorformItemName {
            width: 110px;
            padding: 5px;
            height: 42px;
            line-height: 32px;
            border-right: 2px solid #ffffff;
        }
        .editorformItemFunc {
            padding: 5px;
            width: 184px;
            // border-left: 2px solid #ffffff;
            // height: 42px;
            // line-height: 42px;
            .editorformItemRight {
                display: flex;
                justify-content: space-between;
                align-items: center;
            }
        }
        .editorforminput {
            width: 100%;
        }
        .el-color-picker__trigger {
            width: 172px !important;
        }
        .editorformItemslider {
            width: 90%;
            margin-left: 5%;
        }
        .uploade {
            position: relative;
            height: 24px;
            cursor: pointer;
            input {
                position: absolute;
                width: 100%;
                height: 100%;
                z-index: 555;
                opacity: 0;
                cursor: pointer;
            }
        }
    }
    // tr{
    //     .editorformItemName{
    //         width: 110px;
    //     }
    //     td{
    //         padding: 5px;
    //         .editorforminput{
    //             width: 100% !important;
    //         }
    //         .el-color-picker__trigger{
    //             width: 172px !important;
    //         }
    //         .editorformItemRight{
    //             display: flex;
    //             justify-content: space-between;
    //             align-items: center;
    //             height: 24px;
    //             .img{
    //                 width: 32px; height: 32px;
    //             }
    //         }
    //         .uploade{
    //             position: relative;
    //             height: 24px;
    //             cursor: pointer;
    //             input{
    //                 position: absolute;
    //                 width: 100%;
    //                 height: 100%;
    //                 z-index: 555;
    //                 opacity: 0;
    //                 cursor: pointer;
    //             }
    //         }
    //         .editorformItemslider{
    //             width: 90%;
    //             margin-left: 5%;
    //         }
    //     }
    // }
}

// tif偏移设置对话框
.tifOffSetDefault {
    position: fixed;
    width: 400px;
    // height: 100px;
    z-index: 1000;
    background: rgba(30, 36, 50, 0.6);
    border: 1px solid rgba(32, 160, 255, 0.3);
    border-radius: 2px;
    top: 48px;
    right: 10px;
    padding: 10px 20px;
    color: #fff;
    .boxItems {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-bottom: 15px;
        .names {
            width: 85px;
            text-align: right;
        }
        .statistics {
            margin-right: 15px;
        }
        .selectbuttons {
            color: var(--el-color-white) !important;
            background-color: var(--el-color-primary) !important;
            border-color: var(--el-color-primary) !important;
            outline: 0;
        }
        .movebtn {
            &:hover {
                color: var(--el-color-white) !important;
                background-color: var(--el-color-primary) !important;
                border-color: var(--el-color-primary) !important;
                outline: 0;
            }
        }
    }
    button {
        width: 60px;
        // margin-right: 10px !important;
        // cursor: pointer;
        // margin-bottom: 20px;
        .active {
            background: green;
        }
    }
    .btnbox {
        display: flex;
        justify-content: center;
        margin-top: 30px;
    }
}
.tifOffSetDefaultOffSet {
    right: 320px;
}
